<template>
  <div class="out">
    <div class="top_card fs12 mb15 shadow_gray pb25" v-if="type == 'plus'">
      <div class="pl34 pt25 cblue fs12"><span class="before_line_3">{{card_msg.company || '公司名称'}}</span></div>
      <div class="top_msg disflex pt15 jsbet"  @click="page_turn('index')">
        <div>
          <p class="fbold c38 fs18">{{card_msg.username || '姓名'}}</p>
          <p class="fs14 ca8 pt10 pb25">{{card_msg.post || '职位'}}</p>
          <p class="fs12 c78">» {{card_msg.tel || '电话'}}</p>
          <p class="fs12 c78 pt10">» {{card_msg.email || '邮箱'}}</p>
        </div>
        <img :src="card_msg.picchecked || card1_logo" mode="aspectFill" alt="" class="w60 h60 bradius5">

      </div>
      <div class="disflex jsbet pl25 pr25 pt25">
        <div class="disflex">
          <span class="cblue fs12 mr17" v-if="index != 0">NO.{{index }}</span>
          <img src="https://one-stand.oss-cn-shanghai.aliyuncs.com/yimai_photos/user/tel.png"
               alt="" class="w16 h16 mr17 pl3 pr3"
               @click.stop="makePhone"
               v-if="!hasCard">
          <!--   <img src="https://one-stand.oss-cn-shanghai.aliyuncs.com/yimai_photos/user/share.png"
                  alt="" class="w16 h16"
                  @click.stop="share(card_msg.companyId,card_msg.cardId)">-->

          <button class='w16 h16 bgfff contentbox textr disflex align-cen textr pl3 pr3'
                  id="111"
                  :data-companyId="card_msg.companyId"
                  :data-cardId="card_msg.cardId"
                  :data-companyName="card_msg.company"
                  :data-name="card_msg.username"
                  :data-position="card_msg.post"
                  open-type="share">
            <img src="https://one-stand.oss-cn-shanghai.aliyuncs.com/yimai_photos/user/share.png" alt="" class="w16 h16">
          </button>

        </div>
        <span class="w60 lh20 ba8 bradius10 textc fs12 ca8" v-if="hasCard">我的名片</span>
        <span @click.stop="moreTap"
              class="w60 textc disinblock"
              v-else
        >
                  <img src="https://one-stand.oss-cn-shanghai.aliyuncs.com/yimai_photos/crm/edit_card.png" alt=""
                       class="w16 h16 pl3 pr3"
                  >
        </span>

      </div>
    </div>

    <div class="pt15 pl16 pr15 pt16 bgfff pb15" v-else @click="page_turn('index')">
      <div class="top_card fs12 shadow_gray pb42">
        <div class="pl34 pt25 cblue fs12"><span class="before_line_3">{{card_msg.company || '公司名称'}}</span></div>
        <div class="top_msg disflex jsbet pt41">
          <div>
            <p class="fbold c38 fs18">{{card_msg.username || '姓名'}}</p>
            <p class="fs14 ca8 pt10 pb23">{{card_msg.post || '职位'}}</p>
            <p class="fs12 c78">» {{card_msg.tel || '电话'}}</p>
            <p class="fs12 c78">» {{card_msg.email || '邮箱'}}</p>
          </div>

          <div class="disflex column-reverse">
            <img :src="card_msg.picchecked || card1_logo" alt="" class="w60 h60 bradius5">
          </div>
        </div>
      </div>
    </div>


  </div>

</template>

<script>

  export default {
    name: "BusinessCard",
    props:['card_msg','type','hasCard','isdel','index'],
    data(){
      return{
        card1_logo:'https://one-stand.oss-cn-shanghai.aliyuncs.com/yimai_photos/user/card1_user.png'
      }
    },
    methods:{
      page_turn(url){
        this.$emit('page_turn',url,this.card_msg.companyId , this.card_msg.cardId)
      },
      moreTap(){
        this.$emit('moreTap' , this.card_msg.recordId, this.card_msg.cardId, this.isdel);
      },
      makePhone(){//拨打电话
        if(this.card_msg.tel){
          wx.makePhoneCall({
            phoneNumber: this.card_msg.tel,
          })
        }else{
          wx.showToast({
            title: '还没有添加电话呢！',
            duration: 2000,
            icon: 'none'
          });
        }

      },
      share(companyId,cardId){
        this.$emit('shareApp',companyId,cardId);
      }
    }
  }
</script>

<style scoped>
  .out{
    line-height: 1;
  }
  button{
    border-radius: 0;
  }
</style>
